<!--
 * @Date: 2022-05-23 13:48:01
 * @Author: 陶子
 * @LastEditTime: 2022-05-23 14:28:07
 * @FilePath: \jk_one-stop_cloud_mobile_v1.0\src\views\baseManagement\maintain\malfunctionRepair\verifyDialog.vue
 * @pageName: 这是--(验证)--页面
-->
<template>
  <div class="search-content wrap-apply" :style="{top: GLOBAL.currentEnvironment ? '0' : ''}" v-show="showSearchTag">
    <van-cell-group style="margin-top:0.1rem">
      <p class="label required FormTit"><span></span>是否修复</p>
      <van-field-select-picker :supportClear='true' label="" placeholder="请选择" v-model="modalForm.isRepair" :columns="taskList"
        :option="{ label: 'label', value: 'value' }" @confirm="processConfim" />
      <div class=" bottomLine">
      </div>
    </van-cell-group>
    <van-cell-group>
      <p class="label">备注</p>
      <van-field v-model="modalForm.remarks" rows="2" autosize label="" type="textarea" maxlength="500" placeholder="请输入" show-word-limit />
      <div class="bottomLine"></div>
    </van-cell-group>
    <div class="search-bottom">
      <span class="btnconfirm" @click="btnConfirm">提交</span>
    </div>

  </div>
</template>

<script>
import VanFieldCheckbox from "@/components/ActionSheet/VanFieldCheckbox";
import upload from "@/components/upload/upload";
import VanFieldSelectPicker from "@/components/ActionSheet/VanFieldSelectPicker";
import Search from "@/components/search";
import { verificationRepair } from "@/api/mobile";
export default {
  name: "search",
  components: {
    upload,
    Search,
    VanFieldSelectPicker,
    VanFieldCheckbox,
  },
  data() {
    return {
      showSearchTag: false,
      /***** */
      modalForm: {
        isRepair: undefined,
        remarks: "",
      },
      itemInfo: {},
      taskList: [
        { label: "是", value: "yes" },
        { label: "否", value: "no" },
      ],
    };
  },
  computed: {},
  mounted() {},
  created() {},
  methods: {
    showModal(itemInfo) {
      this.itemInfo = itemInfo;
      this.showSearchTag = true;
    },
    // 工序选择确定
    processConfim(eachItem) {
      if (eachItem) {
        if (this.modalForm.isRepair != eachItem.value) {
          this.modalForm.isRepair = eachItem.value;
        }
      }
    },
    btnConfirm() {
      if (this.modalForm.isRepair) {
        let modalObj = {
          ...this.modalForm,
          repairId: this.itemInfo.id,
        };
        verificationRepair(modalObj).then((res) => {
          if (res.code == 200) {
            this.$toast(res.message);
            this.showSearchTag = false;
            this.$emit("verifyConfirm");
          } else {
            this.$toast(res.message);
          }
        });
      } else {
        this.$toast("请选择是否修复");
      }
    },
  },
};
</script>
<style lang="scss" scoped>
@import "@/assets/theme.scss";
.search-content {
  //  padding-bottom: 0.5rem;
  position: fixed;
  top: 0.45rem;
  width: 100%;
  height: 100vh;
  background: #f5f5f5;
  z-index: 99;
  .formgroup {
    background: #ffffff;
    // padding: 0 0.16rem;
    margin-top: 0.1rem;
    margin-bottom: 0.2rem;
    padding-top: 0.1rem;

    .title {
      width: 0.58rem;
      height: 0.14rem;
      font-size: 0.15rem;
      font-family: PingFang SC;
      font-weight: 400;
      color: #191f25;
      line-height: 0.05rem;
      margin-left: 0.16rem;
    }
  }
}
.bottomLine {
  height: 0.01rem;
  background-color: #f0f0f0;
  margin: 0 0.16rem;
}

.search-bottom {
  width: 100%;
  height: 0.5rem;
  background: #ffffff;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: fixed;
  bottom: 0px;
  padding: 0rem 0.11rem;
  box-sizing: border-box;
  font-size: 0.16rem;
  font-weight: 500;
  z-index: 999;
  .btnconfirm {
    width: 100%;
    height: 0.39rem;
    background: #1890ff;
    border-radius: 0.03rem;
    text-align: center;
    line-height: 0.39rem;
    font-size: 0.16rem;
    font-weight: 500;
    color: #ffffff;
  }
}
</style>